Dashboard Temp Share Shortlinks Frames API

HTMLify

index.html
Views: 367 | Author: cody 
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
<!-- Based on Creating a Magazine Layout with CSS by Kevin Powell (2021)
see: https://www.youtube.com/watch?v=QJz81yva7r0 -->

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="stylesheet" href="style.css" />
    <title>Magazine Layout</title>
  </head>
  <body>
    <main>
      <article>
        <img
          src="https://images.unsplash.com/photo-1611824204322-24963b44d68b?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=650&q=80"
          alt="woman wearing sunglasses"
          class="article-main-image"
        />
        <h1>Dagny Taggart</h1>
        <p class="lead">
          Lorem ipsum dolor, sit amet consectetur adipisicing elit. Recusandae,
          veniam.
        </p>
        <div class="article-body flow">
          <p>
            Lorem ipsum dolor sit, amet consectetur adipisicing elit. Molestiae
            modi ab recusandae aliquid perspiciatis unde dolorum id natus velit
            vel, facere excepturi similique nemo enim quasi nam, expedita
            inventore? Repellat aspernatur ducimus facilis nemo omnis sunt unde,
            vel doloribus error enim id deleniti saepe placeat.
          </p>
          <p>
            Voluptatem ipsum tempora vel quisquam cumque natus nesciunt vitae
            ipsam in inventore, earum eligendi impedit. Sunt quis veniam numquam
            vitae, magnam, debitis reiciendis in voluptas porro voluptatum, est
            consequuntur illo! Assumenda saepe aliquid eos fugiat rerum
            similique sequi illo velit amet officia voluptas, sed ducimus.
          </p>
          <p>
            Quasi necessitatibus mollitia quisquam officiis molestiae fugiat
            officia cumque tempora accusamus adipisci quia, suscipit earum rerum
            illo, fugit architecto fuga eius error labore! Ducimus voluptate
            quae aliquid obcaecati beatae exercitationem quaerat molestiae quos,
            atque dolorum id quo sint vero sit reiciendis cumque consectetur
            molestias temporibus.
          </p>
          <blockquote>
            Lorem ipsum dolor sit amet consectetur adipisicing elit. Officiis,
            blanditiis.
          </blockquote>
          <p>
            Molestiae magnam similique dolorum vero libero doloribus neque,
            voluptas natus sunt facere ipsa cupiditate placeat necessitatibus
            cum perferendis ducimus deserunt architecto nesciunt, illum ab
            aliquid minus dignissimos dolore voluptatibus? Perferendis,
            incidunt! Repellendus numquam nobis quidem totam dolor aliquid.
            Placeat rerum eveniet doloribus asperiores quis iusto!
          </p>
        </div>
      </article>
    </main>
  </body>
</html>

Share this file: